<template>
	<view class="content">
		<view class="twohandbook">
			<view class="progress_block" v-for="(item,index) in searchList">
				<view class="describe" :class="'block'">
					<view class="name">{{item.bookName.length>14?item.bookName.substr(0,14)+'...':item.bookName}}</view>
					<view class="value">ISBN:{{item.isbn}}</view>
				</view>
				<view class="charts-box arcbar" style="background-color: #fff;">
					<view class="plus">
						<!-- <u-icon name="plus-circle" color="#3c9cff" size="30" labelPos="buttom" 
						@click="openBookDetail(item.bookName,item.publisher,item.isbn,item.id)"></u-icon> -->
						
						<image  src="http://1.14.247.152:9797/images/16834icon_fabu.png" style="" mode="widthFix" @click="openBookDetail(item.bookName,item.publisher,item.isbn,item.id)"></image>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 发布弹出层 -->
		<u-popup :show="bookDetailShow" :safeAreaInsetBottom='false' :round="10" mode="center" @close="bookDetailShow = false">
		    <view class="bookDetail">
				<view class="msg">
					<view class="bookTitle">{{bookTitle}}</view>
					<view class="isbn">
						ISBN编码：{{bookIsbn}}
					</view>
					<view style="position: relative; margin-top: 33rpx;height: 90rpx; ">
						<view class="countBuyBookView">
							<uni-number-box v-model="bookNumber"
							 :min="1" :max="3"
							 @change="addNumber"
							  >
							 </uni-number-box>
						</view>
						<view class="fontCss">本</view>
					</view>
				
				<!-- 	<view class="radioCss">
						<u-radio-group
						v-model="defaultRadio"
						placement="row"
						@change="ConfirmLocation"
						>
						<u-radio
						  :size="20"
						  :customStyle="{marginBottom: '8px',padding:'8px'}"
						  v-for="(item, index) in radiolist1"
						  :key="index"
						  :label="item.name"
						  :name="item.name"
						  @change="LocationPopup"
						>
						</u-radio>
						</u-radio-group>
					</view> -->
					<view class="bindweixin">
						<view class="lianxi">
							联系方式
						</view>
						<view class="input1">
							<u--input  v-model="wxNum" placeholder="微信号/手机号" border="bottom" clearable ></u--input>
						</view>
						
					</view>
					<u-button type="primary" text="发布" color="#3c9cff"
					@click="ConfirmPublish(PublishForm,bookNumber)"></u-button>
				</view>
		    </view>
		</u-popup>
		
		<u-popup :show="show1" :round="10" mode="center" :closeOnClickOverlay='false' >
		   
				<view class="msg1">
					<view class="Title">
						请选择正确的校区，以确保展示不同校区的商品，若要修改，可到个人中心页面修改
					</view>
				<view class="button1">
					<u-button type="info" shape='circle' plain text="海珠校区"  color="#fd4f02"
					@click="getArea(0)"></u-button>
				</view>
				<view class="button2">
					<u-button type="info" shape='circle' plain text="白云校区"  color="#fd4f02"
					@click="getArea(1)"></u-button>
				</view>	
					
				</view>
		   
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show1:false,
				wxNum:'',
				bookTitle:'',
				publisher:'',
				bookIsbn:'',
				bookId:'',
				bookNumber: 1,
				PublishForm:{
					// chengse:'选择成色',
					location:'选择地区',
					bookId:'',
				},
				bookDetailShow: false,
				defaultRadio:'',
				searchList: [],
				isTwohandbookShow: false
			};
		},
		computed: {
			bookListShow: {
				get() {
					console.log('999999999',this.limitNumber(this.searchList))
					return this.limitNumber(this.searchList)
				},
				set(value) {
					console.log(this.bookListShow)
					this.$forceUpdate()
				
				}
			}
		},
		onLoad(res) {
			let vm = this
			this.wxNum = getApp().globalData.wxNumber
			console.log('11111111111')
				this.searchList = getApp().globalData.searchList
				console.log('this.searchList搜索列表',this.searchList)
				vm.isTwohandbookShow = true;
			console.log('222222222')
			this.getDefaultRadio()
		},
		methods:{
			async getArea(index){
				//console.log('@@@@@',index)
				getApp().globalData.location = this.location = index
				let header = new Object
				header.Authority = getApp().globalData.Authority
				let toBindLocation = await getApp().UniRequest("/twohandbook/user/authority/toBindLocation?location="+this.location,"GET","",header)
				console.log('getArea里面的toBindLocation',toBindLocation)
				// this.quickLogin()
				this.show1 = false
				wx.showTabBar()
				uni.getUserProfile({
					desc: '用于展示头像',
					async success(res) {
						let user = new Object()
						getApp().globalData.nickName =user.nickName = res.userInfo.nickName
						getApp().globalData.avatarUrl = user.avatarUrl = res.userInfo.avatarUrl
						getApp().globalData.user = user
						let body = new Object()
						body.nick_name = user.nickName
						body.avatar_url = user.avatarUrl
						let data = await getApp().UniRequest("/twohandbook/user/authority/updateNamePc","POST",body,header)
					}
				})
			},
			openBookDetail(bookName,publisher,isbn,id){
				let vm = this
				vm.bookTitle = bookName;
				vm.publisher = publisher;
				vm.bookIsbn = isbn;
				vm.bookDetailShow = true
				vm.bookId = id;
				vm.bookNumber = 1
				vm.PublishForm.bookId=id
			},
			bindwxNum(){
				uni.navigateTo({
					url:'../mine/wechatNumber/wechatNumber'
				})
			},
			async ConfirmPublish(publishForm,bookNumber){
				// this.show1=true;
				let vm = this;
				let header = new Object
				header.Authority = getApp().globalData.Authority
				if(getApp().globalData.wxNumber!==vm.wxNum){
					let data = await getApp().UniRequest("/twohandbook/user/authority/toBindWx?wxNumber="+vm.wxNum,"GET","",header)
					getApp().globalData.wxNumber=vm.wxNum
				}
				let isBindLocation = await getApp().UniRequest("/twohandbook/user/authority/isBindLocation","GET","",header)
				console.log('******isBindLocation.code******',isBindLocation.code)
				if(isBindLocation.code!==20000){
					wx.showToast({
					  title: '请先绑定地区',
					  icon: 'error',
					  duration: 400
					})
					this.show1=true;
					wx.hideTabBar() 
				}else{
					let isBindWx = await getApp().UniRequest("/twohandbook/user/authority/isBindWx","GET","",header)
					if(isBindWx.code==20000){
											uni.showLoading({
												title: '发布中'
											})
											let body=new Object
											body.bookId=publishForm.bookId
											body.count=bookNumber
											let data=await getApp().UniRequest(`/twohandbook/sellBookRecord/authority/sellBook`,"POST",body,header)
											console.log('发布书本的data',data)
											if(data.code === 20000){
												setTimeout(()=>{
													uni.hideLoading()
													uni.showToast({
														title:'发布成功',
														duration:2000
													});
													vm.bookDetailShow = false;
												},400)
											}
						
					}
					else {
						wx.showToast({
						  title: '请填写联系方式',
						  icon: 'error',
						  duration: 800
						})
						return
					}
				}
				
				
			},
			ConfirmLocation(val1){
				console.log('val1啊啊啊啊啊啊啊啊',val1)
				this.PublishForm.location=val1
			},
			getDefaultRadio(){
				if(getApp().globalData.location==0){
					this.defaultRadio= '海珠校区'
				}
				else{
					this.defaultRadio= '白云校区'
				}
				this.PublishForm.location = this.defaultRadio;
			},
			addNumber(value){
				// console.log('#######################')
				let vm = this;
				vm.bookNumber = value
			},
			limitNumber(oldList) {
				//当数组不合法就返回
				if (!oldList) {
					return oldList
				}
				let vm = this
				let list = new Array()
				for (let i = 0; i < oldList.length; i++) {
					let object = new Object
					object.stock = oldList[i].stock
					object.isbn=oldList[i].isbn;
					object.bookId=oldList[i].id
					let name = oldList[i].bookName
					//console.log(name)
					if (name.length >= 18) {
						name = name.slice(0, 15) + "..."
					}
					object.bookName = name
					object.number=1
					object.click=false
					list.push(object)
				}
				return list
			},
		}
	}
</script>

<style lang="scss">
	.content{
		.twohandbook{
			width: 100%;
			.progress_block {
				display: flex;
				justify-content: space-around;
				align-items: center;
				width: 93%;
				margin: auto;
				margin-bottom: 20rpx;
				border-radius: 20rpx;
				height: 156rpx;
				position: relative;
				overflow: hidden;
				background-color: #fff;
				box-shadow: 7rpx 8.5rpx 19.5rpx #DBDBDB;
				.describe {
					width: 240%;
					height: 100%;
					padding: 20rpx;
					letter-spacing: 4rpx;
			
					.name {
					position: relative;
					top: 25rpx;
					color: #000000;
					height: 40%;
					width: 556rpx;
					font-size: 36rpx;
					font-weight: 800;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
					}
			
					.value {
						position: relative;
						top: 35rpx;
						color: #000;
						font-weight: 500;
						font-size: 28rpx;
						height: 30%;
					}
				}
			
				.charts-box {
					width: 40%;
					height: 100%;
					.plus{
						margin-top:46rpx ;
						margin-right: 20rpx;
						image{
							width: 60rpx;
							
						}
					}
				}
				.block {
					background: #ffffff; 
				}
				
			}

		}
		.bookDetail{
			background-color: #fcfcfc;
			width: 575rpx;
			// height: 560rpx;
			border-radius: 30rpx;
			.msg{
				position: relative;
				margin: 32rpx;
				text-align: center;
				.bookTitle{
					font-size: 40rpx;
					font-weight: 800;
					margin-bottom: 20rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					-webkit-box-orient: vertical;
				}
				.isbn{
					margin-bottom: 20rpx;
				}
				.bindweixin{
					font-size: 30rpx;
					color: #1c1d1f;
					height: 105rpx;
					margin-bottom: 11rpx;
					.lianxi{
						width: 117rpx;
						height: 100rpx;
						line-height: 100rpx;
						float: left;
						
					}
					.input1{
						width: 346rpx;
						float: left;
						margin-left: 18rpx;
					}
					
				}
				.button{
					margin-bottom: 20rpx;
					border-radius: 5rpx;
					text-align: center;
					border-style: solid;
					border-color: #c8c8c8;
					color: #c8c8c8;
					border-width: 1rpx;
					border-radius: 40rpx;
					height: 70rpx;
					line-height: 2.2;
				}
				
				.buttonClick{
					margin-bottom: 20rpx;
					border-radius: 5rpx;
					text-align: center;
					border-style: solid;
					border-color: #3c9cff;
					color: #3c9cff;
					border-width: 1rpx;
					border-radius: 40rpx;
					height: 70rpx;
					line-height: 2.2;
				}
				.countBuyBookView{
					position: absolute;
					bottom: 20rpx;
					left: 100rpx;
					.countBuyBook{
						
					}
				}
				.fontCss{
					position: absolute;
					left: 350rpx;
					bottom: 24rpx;
				}
			}
		}
		.msg1{
			width: 575rpx;
			border-radius: 30rpx;
			margin: 10rpx auto;
			font-size: 31rpx;
			letter-spacing: 4rpx;
			font-weight: 600;
			.Title{
				width: 94%;
				margin: 0 auto;
				text-align: center;
			}
			.button1{
				width: 77%;
			    margin: 38rpx auto;
			}
			.button2{
				width: 77%;
				margin: 10rpx auto;
				
			}
		}
	}
</style>
